<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button id="btn">点击</button>
		<script>
		   //1.全局 this--->window    严格模式：window  
		   //"use strict"
		   // console.log(this);
		   
		   //2.普通函数调用  this--->window  严格模式：undefined 
		   // function show(){
			  //  console.log(this);
		   // }
		   //show();
		   //3.自执行函数-->自己调用自己  this-->window  严格模式：undefined
		     //"use strict";
		     // (function(){
		   			  //  console.log(this);
		     // })()
		     
		     //4.回调函数---》一个函数是另一个函数的参数  this---》window 严格模式：undefined
		   //    var arr=[1,2,3];
		   			// arr.map(function(item,index){
		   			// 	console.log(this);
		   			// })
		   			
		   			//注意：定时器  this---》window  严格模式：window
		   			// var timer=setTimeout(function(){
		   			// 	console.log(this);
		   			// })
					
		   
		   //5.事件绑定  this--->当前触发事件的DOM元素  严格模式:不变
		   // btn.onclick=function(){
			  //  console.log(this);//<button id="btn">点击</button>
		   // }
		   
		   // function show(){
		   // 		console.log(this);
		   // }
		   // btn.onclick=show;
		   
		   // btn.addEventListener("click",function(){
			  //  console.log(this);
		   // })
		   
		   //6. 函数前面是否 有点  this--->点前面的所有内容 严格模式:不变
		  // "use strict";
		   // var obj={
			  //  name:"lili",
			  //  show:function(){
				 //   console.log(this);
			  //  }
		   // }
		   // obj.show()
		   
		   //7.箭头函数  箭头函数里面没有this---->上级上下文中的this(上级作用域)
		   //上级作用域：这个函数在哪里创建的
		  //   "use strict";
		  //    let  fn=()=>{
				//  console.log(this);
			 // }
		   
		  //    fn();//全局
		  
		  
		  // var obj = {
		  //   name: 'obj',
		  //   foo1: () => {//箭头函数 上级上下文（看obj的上级上下文---》全局）
		  //     console.log(this.name)//this-->window
			 //  //this.name--->window.name
		  //   },
		  //   foo2: function () {
		  //     console.log(this.name)//this-->obj
			 //  //this.name--->obj.name--> 'obj'
		  //     return function(){
		  //       console.log(this.name)//window.name--->"window"
		  //     }//===》0x001
		  //   }
		  // }
		  // var name = 'window'
		  // obj.foo1()//正常逻辑 this-->obj   'window'
		  // obj.foo2()()
		  // //1. obj.foo2()  //正常逻辑 this-->obj 
		  // //2. 0x001()     //普通函数执行  this--->window
		  
		  
		  // var obj = {
		  //   name: 'obj',
		  //   foo1: () => {//箭头函数 上级上下文（看obj的上级上下文---》全局）
		  //     console.log(this.name)//this-->window
		  // 			  //this.name--->window.name
		  //   },
		  //   foo2: function () {
		  //     console.log(this.name)//this-->obj
		  // 			  //this.name--->obj.name--> 'obj'
		  //     return ()=>{//箭头函数  上级上下文 foo2 (obj)
		  //       console.log(this.name)//obj--->obj.name--->"obj"
		  //     }//===》0x001
		  //   }
		  // }
		  // var name = 'window'
		  // obj.foo1()//正常逻辑 this-->obj   'window'
		  // obj.foo2()()
		  // 1. obj.foo2()  //正常逻辑 this-->obj 
		  // 2. 0x001()     //箭头函数
		  
		 
		  
		  var name = 'window'
		  var obj1 = {
		    name: 'obj1',
		    foo: function () {
		      console.log(this.name)//obj1.name "obj1"
		      return function () {//普通函数执行
		        console.log(this.name)//window.name "window"
		      }//==》0x001
		    }
		  }
		  var obj2 = {
		    name: 'obj2',
		    foo: function () {
		      console.log(this.name)//obj2.name "obj2"
		      return () => {//箭头函数 上级上下文（foo--->obj2)
		        console.log(this.name)//obj2-->obj2.name  "obj2"
		      }//===>0x002
		    }
		  }
		  var obj3 = {
		    name: 'obj3',
		    foo: () => {//箭头函数  上级上下文（obj3的上级上下文---》全局）
		      console.log(this.name)//window.name--->'window'
		      return function () {
		        console.log(this.name)//window.name--->"window"
		      }//===>0x003
		    }
		  }
		  var obj4 = {
		    name: 'obj4',
		    foo: () => {//箭头函数  上级上下文（obj4的上级上下文---》全局）
		      console.log(this.name)//window.name---》'window'
		      return () => {//箭头函数  上级上下文(foo--->全局)
		        console.log(this.name);//window.name--->"window"
		      }//===>0x004
		    }
		  }
		  
		  obj1.foo()()
		  //obj1.foo()  this-->obj1   
		  //0x001()   普通函数执行
		  obj2.foo()()
		  //obj2.foo() this-->obj2
		  //0x002()
		  obj3.foo()()
		  //obj3.foo() 
		  //0x003()  普通函数执行
		  obj4.foo()()
		  //obj4.foo()
		  //0x004()
		</script>
	</body>
</html>
